<template>
  <div style="width: 100%;height: 100%">
    <returnActionList></returnActionList>
    <div class="fd itemcenter">
      <el-tabs v-model="activeName2" type="border-card" @tab-click="handleClick">
        <el-tab-pane label="按小时租" name="first">
          <div style="width: 100%" class="fd itemcenter">
            <el-form label-position="left" label-width="160px" :model="order.once">
              <el-form-item label="原价（元）/时">
                <el-input v-model="order.once.originalMoney"></el-input>
              </el-form-item>
              <el-form-item label="单价（元）/时">
                <el-input v-model="order.once.money"></el-input>
              </el-form-item>
              <el-form-item label="预付金额（元）">
                <el-input v-model="order.once.prepay"></el-input>
              </el-form-item>
              <el-form-item label="押金（元）">
                <el-input v-model="order.once.guaranteeMoney"></el-input>
              </el-form-item>
            </el-form>
            <el-button type="primary" @click="setPriace(mode=0)" style="width: 60%">保存</el-button>
          </div>
        </el-tab-pane>
        <el-tab-pane label="按次租" name="second">
          <div style="width: 100%" class="fd itemcenter">
            <el-form label-position="left" label-width="160px" :model="order.hour">
              <el-form-item label="原价（元）/次">
                <el-input v-model="order.hour.originalMoney"></el-input>
              </el-form-item>
              <el-form-item label="租金">
                <el-input v-model="order.hour.money"></el-input>
              </el-form-item>
              <el-form-item label="押金（元）">
                <el-input v-model="order.hour.guaranteeMoney"></el-input>
              </el-form-item>

            </el-form>
            <el-button type="primary" @click="setPriace(mode=1)" style="width: 60%">保存</el-button>
          </div>

        </el-tab-pane>
        <el-tab-pane label="按天租" name="third">
          <div style="width: 100%" class="fd itemcenter">
            <el-form label-position="left" label-width="160px" :model="order.day">
              <el-form-item label="原价（元）/天">
                <el-input v-model="order.day.originalMoney"></el-input>
              </el-form-item>
              <el-form-item label="单价（元）/天">
                <el-input v-model="order.day.money"></el-input>
              </el-form-item>

              <el-form-item label="押金（元）">
                <el-input v-model="order.day.guaranteeMoney"></el-input>
              </el-form-item>
            </el-form>
            <el-button type="primary" @click="setPriace(mode=2)" style="width: 60%">保存</el-button>
          </div>
        </el-tab-pane>

      </el-tabs>
    </div>
    <!--<div class="fr center">-->
    <!--<div class="fd center" style="width: 50%">-->
    <!--<div style="margin: 20px;"></div>-->
    <!--<el-form label-position="left" label-width="160px" :model="formLabelAlign">-->
    <!--<el-form-item label="押金（元）">-->
    <!--<el-input v-model="formLabelAlign.cashPledge"></el-input>-->
    <!--</el-form-item>-->
    <!--<el-form-item label="中午单价（元）">-->
    <!--<el-input v-model="formLabelAlign.midday"></el-input>-->
    <!--</el-form-item>-->
    <!--<el-form-item label="中午原价（元）">-->
    <!--<el-input v-model="formLabelAlign.formerMidday"></el-input>-->
    <!--</el-form-item>-->
    <!--<el-form-item label="晚上单价（元）">-->
    <!--<el-input v-model="formLabelAlign.night"></el-input>-->
    <!--</el-form-item>-->
    <!--<el-form-item label="晚上原价（元）">-->
    <!--<el-input v-model="formLabelAlign.formerNight"></el-input>-->
    <!--</el-form-item>-->
    <!--<el-form-item label="一天单价（元）">-->
    <!--<el-input v-model="formLabelAlign.oneDate"></el-input>-->
    <!--</el-form-item>-->
    <!--<el-form-item label="一天原价（元）">-->
    <!--<el-input v-model="formLabelAlign.formerOneDate"></el-input>-->
    <!--</el-form-item>-->

    <!--</el-form>-->
    <!--<el-button type="primary" @click="setPriace">保存</el-button>-->

    <!--<div></div>-->
    <!--</div>-->
    <!--</div>-->
  </div>
</template>

<script>
  export default {
    name: "SetPrice",
    data() {
      return {
        activeName2: 'first',
        labelPosition: 'right',

        order:{
          once:{//按小时
            originalMoney:'3',//原价
            money:'2',//实际价格
            prepay:'16',//预付
            guaranteeMoney:'10',//押金
          },
          hour:{//按次
            originalMoney:'15',
            money:'13',
            guaranteeMoney:'10',
          },
          day:{//按天
            originalMoney:'20',
            money:'15',
            guaranteeMoney:'10',
          }
        }
      }
    },
    methods: {
      handleClick(tab, event) {
        console.log(tab.index, event);
      },
      setPriace: function (mode) {
        console.log('保存成功',mode)
        this.$message({
          message: '保存成功',
          type: 'success'
        });
      }
    }
  }
</script>

<style>
  .el-tabs__item {
    padding: 0 80px;

    height: 40px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    line-height: 40px;
    display: inline-block;
    list-style: none;
    font-size: 20px;
    font-weight: 500;
    color: #303133;
    position: relative;
  }

</style>
